<mat-select *ngIf="extendedProperties && extendedProperties.plain; else matFormField" (selectionChange)="onChange()" [placeholder]="(placeholder ? placeholder : 'SDK.VALUE') | translate"
    [compareWith]="compareObjects" [(ngModel)]="value" data-automation-id="process-name-selector" [disabled]="disabled">
    <mat-option *ngIf="!required"></mat-option>
    <mat-optgroup *ngFor="let processModel of processes | async | keyvalue" [label]="processModel.key">
        <mat-option *ngFor="let processInfo of processModel.value" [value]="processInfo.processDefinitionId">
            {{processInfo.processName}}
        </mat-option>
    </mat-optgroup>
</mat-select>
<ng-template #matFormField>
    <mat-form-field>
        <mat-select (selectionChange)="onChange()" [compareWith]="compareObjects" [(ngModel)]="value" [placeholder]="(placeholder ? placeholder : 'SDK.VALUE') | translate"
            data-automation-id="process-name-selector" [disabled]="disabled">
            <mat-option *ngIf="!required"></mat-option>
            <mat-optgroup *ngFor="let processModel of processes | async | keyvalue" [label]="processModel.key">
                <mat-option *ngFor="let processInfo of processModel.value" [value]="processInfo.processDefinitionId">
                    {{processInfo.processName}}
                </mat-option>
            </mat-optgroup>
        </mat-select>
    </mat-form-field>
</ng-template>
